package com.example.composemodifiterdemo

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.IconButton
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material.icons.filled.Share
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

/**
 *@author: njb
 *@date:  2023/2/8 11:25
 *@desc:
 */
class LinearLayoutActivity:ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            //LinearLayoutSample()
            RowSample()
        }
    }

    @Composable
    fun LinearLayoutSample(){
        Column (modifier = Modifier
            .border(1.dp, Color.Black)//加上边框效果
            .size(150.dp),
        verticalArrangement = Arrangement.Center)//设置布局水平或者垂直
        {
            Text(text = "Hello, World!",
            style = MaterialTheme.typography.h6,
            modifier = Modifier.align(Alignment.CenterHorizontally))//设置文字居中对齐
            Text(text = "Jetpack Compose",modifier = Modifier.align(Alignment.CenterHorizontally))
        }
    }

    /**
     * Row组件能够将内部子项按照从左到右的方向水平排列。和Column组件配合，我们可以构建很丰富的界面
     */
    @Preview
    @Composable
    fun RowSample(){
        androidx.compose.material.Surface(
            shape = RoundedCornerShape(8.dp),
            modifier = Modifier
                .padding(horizontal = 12.dp)//设置surface的外边距
                .fillMaxWidth(),
            elevation = 10.dp
        ) {
          Column(
              modifier = Modifier.padding(12.dp)//设置内容的外边距
          ) {
            Text(text = "Jetpack Compose是什么？",
            style = MaterialTheme.typography.h6)
            Spacer(modifier = Modifier.padding(vertical = 6.dp))
            Text(text = "Jetpack Compose是用于构建原生Android界面的新工具包。它可简化并加快Android上的界面开发，使用更少的代码、强大的工具和直观的Kotlin Api,让应用生动而精彩。")
            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.SpaceBetween
            ){
               IconButton(onClick = { /*TODO*/ }) {
                   Icon(Icons.Filled.Favorite, null)
               }
                IconButton(onClick = { /*TODO*/ }) {
                    Icon(painterResource(id = R.drawable.ic_baseline_chat_24), null)
                }
                IconButton(onClick = { /*TODO*/ }) {
                    Icon(Icons.Filled.Share, null)
                }
            }
          }
        }
    }


}